<template>
	<view>
		
		<u-sticky bgColor="#fff">
				<u-tabs :current="index" :list="tabs" :scrollable="false"></u-tabs>	
					
				</u-sticky>
				
				
				
				<view class="position-grid">
					<view class="position-title">
						<image src="/static/艾什TOKEN.png"></image>
						<text>热门岗位</text>
					</view>
					
					
					<u-grid   :border="false"    :col="2" >
					        <u-grid-item  v-for="position in positions">
							<view class="position" @click="handelClinepositon(position.id)">
														
							<text class="grid-text">{{position.name}}</text>
							<text class="grid-text">{{position.id}}</text>
														
							</view>
					               
					               
					           </u-grid-item>
							
											
					       </u-grid>
									
					
				</view>
				 
				<!--view class="position-view">
					<view class="position">
						java
					</view>
					<view class="position">
						js
					</view>
					<view class="position">
						jRuoyi
					</view>
					<view class="position">
						jeve
					</view>
				</view-->
		
	</view>
	
</template>

<script>
	
	
	
	import { listAll,genQuestion } from '@/api/interview/position';
	
	export default {
		
		
		data() {
			return {
				index:1,
				tabs: [ {
					name:"职位面试"
				},{name:"简历面试"},{name:"hhh"},{name:"简历管理"},{name:"个人中心"}],
				positions:[]
				
			};
		},
		methods: {
			getPositions(){
				listAll().then(res=>
				{
					this.positions=res.data
					console.log("接下来是...this")
					console.log(this.positions)
				})
			},
			
		
		onLoad(){
			//自动加载岗位列表
			this.getPositions();
			
		},
		handelClinepositon(positionId)
		{
			
			console.log("ID:",positionId);
			//调用接口 生成面试记录 获取面试题 并缓存
			genQuestion(positionId).then(res=>{
				console.log("interview RECORD:",res.data)
				uni.setStorageSync("interviewRecord",res.data);
				
			
			
			
			
			})
		
			//跳转页面
			uni.navigateTo({
				url:'/pages/answer/answer'
				
			})
		}
		}
	}
</script>

<style lang="scss">
	.position-title
	{display: flex;
	align-items: center;
	image{
		width: 80rpx;
		height: 80rpx;
	}
	
	
	}
	
.position-view
{
	
	background-color: red;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	padding: 30rpx;
	justify-content: space-between;
	
}
.position{
	width: 200rpx;
		
		height: 150rpx;
		text-align: center;
		line-height: 150rpx;
		border: 1rpx solid #909399;
		 margin-bottom: 40rpx;
		 border-radius: 20rpx;
		
	}

.grid-text {
	        font-size: 14px;
	        color: #909399;
	        padding: 10rpx 0 20rpx 0rpx;
	        /* #ifndef APP-PLUS */
	        box-sizing: border-box;
	        /* #endif */
	    }
.position_grid{
	padding-top: 50rpx;
}
</style>